<div class="center-align from-container z-depth-5 white">
	<h3>Sign up</h3>
	<form>
		<div class="row">
			<div class="input-field">
				<i class="material-icons prefix">perm_identity</i>
				<input name="username" id="username" type="text">
				<label for="username">Username</label>
			</div>
		</div>
		<div class="row">
			<div class="input-field">
				<i class="material-icons prefix">lock</i>
				<input name="password" id="password" type="password">
				<label for="password">Password</label>
			</div>
		</div>
		<div class="row">
			<div class="input-field">
				<i class="material-icons prefix">lock</i>
				<input name="password2" id="password2" type="password">
				<label for="password2">Check Password</label>
			</div>
		</div>
		<div class="row">
			<div class="input-field">
				<i class="material-icons prefix">email</i>
				<input name="email" id="email" type="text">
				<label for="email">Email</label>
			</div>
		</div>
		<div class="row">
			<div class="input-field">
				<div class="input-field col s10" style="margin:0px auto auto -10px;">
					<i class="material-icons prefix">spellcheck</i>
					<input name="captcha" id="captcha" type="text">
					<label for="captcha">Captcha</label>
				</div>
				<div class="col s2">
					<a id="getcaptcha" class="waves-effect waves-light btn" onclick="doCaptcha()">Get</a>
				</div>
			</div>
		</div>
		<div class="row">
			<div class="input-field">
				<a href="#!register" onclick="doRegister()" class="btn waves-effect waves-light green accent-4">
					<i class="material-icons left">perm_identity</i>Sign up
				</a>
			</div>
			<div class="right-aligin" style="margin-top:20px">
				<span class="grey-text">
					<a href="#!login">Sign in?</a>
				</span>
			</div>
		</div>
	</form>
</div>
<script>
function doCaptcha(){
	alert("Send");
}

function doRegister() {
	//show loading
	$("#loading").fadeIn();
	//gen data
	var json = JSON.stringify({
		username: $("#username").val(),
		password: $("#password").val()
	});
	//do POST
    $.ajax({  
		url: '/cgi-bin/register.lua' ,  
		type: 'POST',  
        data: json,
        async: true,
        cache: false,  
		contentType: false,  
        processData: false,  
        success: function (res) {
			//hide loading
			$("#loading").fadeOut();
			//alert res
			alert(res);
            //window.location.href="/404.html";
        },  
        error: function (res) {
			//hide loading
			$("#loading").fadeOut();
		    alert(res);  
        }
     });  
}

$(document).ready(function() {
	$("#loading").fadeOut();
});
	
</script>

